# AI 创意应用 - 程序员人格测试 CBTI 项目

本项目是一个程序员专属的人格测试网站 CBTI（Coder Behavior Type Indicator），用 30 道编程相关的趣味题目测出你的编程人格类型。全程使用 Cursor + Claude 进行 Vibe Coding，1 小时内完成开发上线。

在线体验：https://cbti.codefather.cn

项目代码免费开源：https://github.com/liyupi/cbti-test

大家好，我是程序员鱼皮。

大家应该听说过 MBTI 人格测试吧？

没想到，这几天，有个模仿 MBTI 测试的网站突然火了，叫做「SBTI」。

也是用 30 道选择题来测试出你的人格类型，只不过，结果会更抽象……

比如我测试出来自己是「握草人」，可能是我还不够抽象？这个人格的解读我都读不懂……

![](https://pic.yupi.icu/1/image-20260413134621011.png)

我看完就想：握草？这个网站为啥能火啊？现在用 AI 编程做这种测试小网站还不简单？要不我也来一个？

说干就干，于是我花了 1 个小时，用 AI 编程做出了程序员专属的 **CBTI（Coder Behavior Type Indicator）程序员行为类型测试**。

👉🏻 在线体验：https://cbti.codefather.cn

![](https://pic.yupi.icu/1/image-20260413135126605.png)

用 30 道题测出你的编程人格，而且代码完全开源。

👉🏻 开源地址：https://github.com/liyupi/cbti-test

![](https://pic.yupi.icu/1/image-20260413135149352.png)



## CBTI 是什么？

首先郑重声明，CBTI 是一个有科学依据的正经测试，不是抽象整活的！

我让 AI 深度分析了 MBTI 和 SBTI 的题库、计分逻辑，还有 MBTI 16personalities 的人格体系，在这个基础上设计了 CBTI 的维度模型。整套测试覆盖代码质量、Bug 处理、团队协作、技术驱动、AI 态度这 5 大方向，一共 15 个维度。

随便给大家看几道题目感受一下：

1）产品说「先上，后面优化」，你心想？

- 后面是哪辈子？行吧先糊上去
- 写个 TODO，虽然大概率会变成遗书
- 写技术方案，排进迭代里

![](https://pic.yupi.icu/1/image-20260413135743602.png)

2）周五 5:59 群里弹消息，线上炸了。你？

- 假装没看到，手机静音，人已消失
- 先看看严重不严重
- 秒回 “我看看”，打开监控面板

![](https://pic.yupi.icu/1/image-20260413135805157.png)

而且现在 AI 编程也很火嘛，我也与时俱进加了相关的题。比如 Cursor/Copilot 到期了公司不报销，你？

- 到期就到期，手写也不是不行
- 找找免费替代品
- 秒续！求求再给我点 tokens！

![](https://pic.yupi.icu/1/image-20260413135847877.png)

我自己测出来是 HACK 野生黑客，座右铭是「又不是不能用.jpg」。个人觉得还挺准，毕竟在 AI 编程时代，我搞过很多 Vibe Coding 的小项目，确实是百无禁忌、能跑就行，做完一个就去搞下一个。

![](https://pic.yupi.icu/1/image-20260413140345748.png)

测试结果共有 28 种人格，命名全是跟编程相关的，比如什么 SUDO 万能管理员、NULL 空指针、CTRL-C 复制粘贴工程师、996 卷王之王、404 隐身人、VIBE 氛围程序员等等。另外还设计了一个隐藏人格 ☕ JAVA 咖啡因驱动开发者，能触发的朋友应该是有点儿东西的……

![](https://pic.yupi.icu/1/image-20260413135603390.png)



## 完整开发过程

这个项目我只花了 1 个小时左右就上线了，全程 Vibe Coding，用 Cursor + Claude 完成。

没有用什么复杂的方法论，也不需要什么 Harness Engineering，就是不断跟 AI 对话、提需求、给反馈。

下面分享一下关键流程。

**1、分析参考项目，提取产品精髓**

给 AI 的初始提示词很重要。我先在网上找到了一份 SBTI 的完整题库和计分逻辑报告，连同 SBTI 官网、MBTI 16personalities 官网一起丢给 AI，让它深度分析这些测试的人格体系、计分方式和传播机制。

并且给 CBTI 定了方向：面向编程，要有科学依据和实用价值，同时具备抽象整活和流量传播属性。

![](https://pic.yupi.icu/1/image-20260413140817081.png)

然后 AI 就直接完成了初始网站的开发和测试：

![](https://pic.yupi.icu/1/image-20260413141043674.png)



**2、内容反复迭代**

AI 初版生成的人格代码都差不多，看着毫无辨识度，于是我让它全网搜索程序员相关的热梗，一遍遍重做人格体系。

![](https://pic.yupi.icu/1/image-20260413141131319.png)

这个阶段来来回回改了很多版，最后我把人格从最初十几种扩展到了 27 种，引入了 AI 编程这个新维度，题目内容也从正经八百改成了口语化、有共鸣的风格。

![](https://pic.yupi.icu/1/image-20260413141241183.png)



**3、UI 设计优化**

一开始 AI 生成的主页像个 B 端管理后台，又丑又复杂。

我直接跟它说主页尽量简洁，一句 Slogan 再加一个「开始测试」按钮就够了。

![](https://pic.yupi.icu/1/image-20260413141547295.png)

配色换成橙色系，再用 frontend-design 这个 Agent Skill 来优化整体视觉效果。答题页面也加了答题卡、进度条、快速跳题这些交互细节。

![](https://pic.yupi.icu/1/image-20260413141630018.png)



**4、人格图片制作**

如果是以前，网站图片素材的制作绝对要花大把的时间。

但现在利用 AI，这件事可以在几分钟内完成。

我让 AI 参考 MBTI 官方网站那种低多边形风格的人物形象，生成给 Nano Banana 这个 AI 绘图工具使用的提示词。

注意，这里有个小技巧，我不是让 AI 分别给 28 个角色都生成一段提示词，那样又费时又烧钱。而是分为 2 批，每批 14 个人物放在 **同一张图片** 里生成。这样只需要使用 2 段提示词，生成 2 张图就够了。

![](https://pic.yupi.icu/1/image-20260413141753739.png)

效果还不错吧：

![](https://pic.yupi.icu/1/image-20260413142143210.png)

然后让 AI 自己去理解这张完整的图片，写 Python 脚本来切割图片、压缩调整尺寸、移除空白背景等等，最后得到了 28 个角色图片。

![](https://pic.yupi.icu/1/image-20260413142347871.png)



**5、更多功能完善**

确保题目内容和网站功能正常运行后，我还优化了很多网站的细节，加了分享文案、Canvas 渲染的分享海报、五维雷达图、隐藏人格彩蛋这些功能。

![](https://pic.yupi.icu/1/image-20260413142811945.png)

由于网站本身功能并不复杂，每个功能我都是无脑让 AI 生成，所以过程中也遇到了一些问题，比如分享海报一开始字太小、二维码没生成、后来又太大，调了好几轮才满意。

![](https://pic.yupi.icu/1/image-20260413142903376.png)



**6、部署上线和验证**

由于网站不依赖后端，所以部署上线操作无比简单。

我用了 EdgeOne Pages 这个 MCP，只需要跟 AI 对话，AI 会自动执行 Next.js 框架的 build 命令把代码导出为静态的 HTML 网页，然后部署网页到腾讯云 EdgeOne Pages 服务，1 分钟就完成了部署上线。

![](https://pic.yupi.icu/1/image-20260413143449058.png)

可以在腾讯云 EdgeOne Pages 控制台查看到已上线的项目，还可以自定义域名：

![](https://pic.yupi.icu/1/image-20260413143532414.png)

上线之后，我再让 AI 自主跑了一遍所有流程，确认上线后的功能也能正常使用，并且 30 道题能覆盖全部 28 种人格。

大功告成！



## 写在最后

这个项目技术上其实没什么难度，就是一个纯前端静态网站，没有后端、没有数据库，核心算法也就是算分然后做向量距离匹配。

现在有了 AI 编程，这种小项目真的人人都能做，1 个小时就能从一个想法变成一个可以分享给朋友的网站。如果你也有有趣的创意想法，不妨动手试试，说不定下一个爆款就是你做的呢！



## 推荐资源

1）鱼皮 AI 导航网站：[AI 资源大全、最新 AI 资讯、免费 AI 教程](https://ai.codefather.cn)

2）编程导航学习圈：[学习路线、编程教程、实战项目、求职宝典、交流答疑](https://www.codefather.cn)

3）程序员面试八股文：[实习/校招/社招高频考点、企业真题解析](https://www.mianshiya.com)

4）程序员写简历神器：[专业模板、丰富例句、直通面试](https://www.laoyujianli.com)

5）1 对 1 模拟面试：[实习/校招/社招面试拿 Offer 必备](https://ai.mianshiya.com)